﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!--此页面实现Word图片自动批量上传的功能-->
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>WordPaster For KindEditor-4.x</title>
    <link type="text/css" rel="Stylesheet" href="WordPaster/css/WordPaster.css" />
    <link type="text/css" rel="Stylesheet" href="WordPaster/js/skygqbox.css" />
    <link type="text/css" rel="stylesheet" href="themes/simple/simple.css" />
    <script type="text/javascript" charset="utf-8" src="kindeditor-min.js"></script>
    <script type="text/javascript" charset="utf-8" src="lang/zh_CN.js"></script>
    <script type="text/javascript" src="WordPaster/js/json2.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/jquery-1.4.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/skygqbox.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/w.edge.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/w.app.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/w.file.js" charset="utf-8"></script>
    <script type="text/javascript" src="WordPaster/js/w.js" charset="utf-8"></script>
    <script type="text/javascript" src="vue.min.js" charset="utf-8"></script>
</head>
<body>
    <div style=" font-size:medium; line-height:130%;">
        <p>演示方法：</p>
        <ul style="list-style-type:decimal;">
            <li>打开Word文档，复制多张图片，然后点击编辑器中的图片粘贴按钮<img alt="粘贴图片" src="WordPaster/css/paster.png" width="16px" height="16px" />，编辑器将自动上传所有图片。</li>
            <li>复制电脑中任意图片文件，然后点击编辑器中的粘贴图片按钮<img alt="粘贴图片" src="WordPaster/css/paster.png" width="16px" height="16px" />。</li>
            <li>通过QQ或其它软件截屏，复制图片，然后点击编辑器中的图片粘贴按钮<img alt="粘贴图片" src="WordPaster/css/paster.png" width="16px" height="16px" />。</li>
        </ul>
        <p>相关问题：</p>
        <ul style="list-style-type:decimal;">
            <li>安装插件<a target="_blank" href="http://www.ncmem.com/webapp/wordpaster/pack.aspx">下载插件</a></li>
            <li>WindowxXP/Windows7/Windows2003如果无法识别数字证书，请先下安装<a target="_blank" href="http://www.ncmem.com/download/WoSignRootUpdate.rar">数字签名根证书</a></li>
        </ul>
    </div>
    <!--KindEditor编辑器-->
    <div id="kind">
        <kindeditor ref="kind"></kindeditor>
    </div>
    <script>
        Vue.component('kindeditor', {
            data: function(){
                return {
                    editor: null
                }
            },
            props: {
                value: '',
                config: {}
            },
            mounted: function(){
                WordPaster.getInstance({
                    PostUrl: "http://localhost:8893/asp.net/upload.aspx"
                }).Load();//加载控件

                var editor;
                KindEditor.ready(function (K) {
                    editor = K.create('#editor'
                        ,
                        {
                            items: [
                                'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'cut', 'copy', 'paste',
                                'plainpaste', 'wordpaste', 'wordpaster', 'netpaster', 'pptpaster', '|', 'justifyleft', 'justifycenter', 'justifyright',
                                'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
                                'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
                                'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
                                'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image',
                                'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'map', 'code', 'pagebreak',
                                'link', 'unlink', '|', 'about']
                            , afterCreate: function () {
                                WordPaster.getInstance().SetEditor(this);
                                var self = this;
                                //自定义 Ctrl + V 事件。
                                KindEditor.ctrl(self.edit.doc, 'V', function () { WordPaster.getInstance().Paste(); });
                            }
                        });
                    editor.addContextmenu({
                        title: '粘贴',
                        click: function () {
                            WordPaster.getInstance().Paste();
                            editor.hideMenu();
                        },
                        cond: function () { return true; },
                        width: 150,
                    });
                    // 插入分割线
                    //editor.addContextmenu({ title: '-' });
                });
            },
            methods: {},
            destroyed: function(){ },
            template: '<div><textarea id="editor" name="editor" style="width:720px;height:300px;visibility:hidden;"/></div>'
        });

        var kind = new Vue({
            el: '#kind',
            data: {
            }
            , mounted: function () {
            }
        });
    </script>
</body>
</html>